前言：Redux Toolkit 是目前編寫Redux 代碼的官方推薦，個人覺得如果是學習Redux新手的話，先了解Redux工作原理，對於學習Redux-toolkit相對上比較容易上手，所以今天先介紹Redux。

Redux是一個全局狀態管理工具，CDS(Common Data Service 數據庫管理系統)，將應用程序中組件之間的狀態數據保存在一個全局位置（store）進行管理存儲，並將其提供給應用程序中的任何組件，而無需透過 props 傳遞到多個層別。

Redux基本術語：

1. Store =>保存應用程序所有的數據或狀態。

2. Action =>是Reducer函數中的參數，action.type描述要做什麼動作，例如要建立一個計數器App，其中就有增量/減量動作。

3. Reducer => reducer是管理Redux中狀態的函數，它管理狀態並返回更新的狀態，根據Store.dispatch 調度派發經由switch條件判斷而執行動作，然後依據該動作內Payload的值更新store中的狀態。

reducer()函數需要二個參數，state和 action，在reducer中可處理多個動作，由switch條件判斷，依動作類型action.type跟每個 case 條件比對，符合case 條件，執行case的內容並返回一個新的狀態值給store。例如dispatch 的action .type是increment，則執行case “INCREMENT”的內容返回一個狀態值。

4. dispatch ()=>Dispatch()需要二個值，一個type，是action.type定義要調度動作的action屬性，它是reducer switch判斷式中條件比對執行哪個動作的依據。第二個值是payload,每次狀態更新的值。

Redux工作原理：

1. npm install redux react-redux

2. 在index.js中

        import {createStore} from ‘redux’;
        import {Provider} from ‘react-redux’;        
       < Provider store={store}>
         < App />
      < /Provider>

Provider是一個組件，它將App.js應程程式組件包圍和包裝，然後將store作為屬性傳遞給Provider組件，將store依次提供給應用程式。

3.

const store = createStore(reducer,1)

createStore()方法有二個參數，第一個是reducer，返回一個新的狀態值給store，第二個是狀態值。

4.

const reducer = (state=0,action ) =>{
     switch(action.type) {
case “INCREMENT”:
return state = state+action.payload
case “DECREMENT”:
return state = state-action.payload
}

5.Store.dispatch，用dispatch方法在store執行調度動作

Store.dispatch({
 Type:” increment”,
Payload:10
})
Store.dispatch({
 Type:”decrement”,
Payload:10
})

6.Store.subscribe(() =>console.log(store.getState()));每當store狀態更新時會執行回調函數，在控制台顯示獲取更新狀態的記錄